<template>
  <div class="dashboard">
    <CountPanel />

    <el-row class="mt-3" :gutter="15">
      <el-col :span="12">
        <DashboardNoticesPanel />
      </el-col>

      <el-col :span="12">
        <DashboardTodoPanel />
      </el-col>
    </el-row>

    <el-row class="mt-3" :gutter="15">
      <el-col :span="12">
        <DashboardDevicesPanel />
      </el-col>

      <el-col :span="12">
        <CountPanelToday />
        <!-- <el-card shadow="never" header="今日运营" /> -->
      </el-col>
    </el-row>
  </div>
</template>

<script setup lang="ts">
defineOptions({
  name: "Dashboard",
  inheritAttrs: false,
});
import { useUserStore } from "@/store/modules/user";
import CountCard from "./components/count-card.vue";
import CountPanel from "./components/count-panel.vue";
import DashboardNoticesPanel from "./components/dashboard-notices-panel.vue";
import DashboardTodoPanel from "./components/dashboard-todo-panel.vue";
import DashboardDevicesPanel from "./components/dashboard-devices-panel.vue";
import CountPanelToday from "./components/count-panel-today.vue";

const userStore = useUserStore();
const date: Date = new Date();
</script>

<style lang="scss" scoped>
.dashboard {
  padding: 10px;
}
</style>
